<template>
	<sdc-navbar backText="" title="" :offBack="true" backIconName="plus" @leftClick="clickLeft">
		<view slot="content" class="u-flex u-row-center">
			<view class="search">
				<u-search
					height="50"
					placeholder="请输入菜谱名" 
					v-model="keyword"
					:show-action="false"
					:disabled="true"
					@tap="clickSearch"
					color="#333333"
					bg-color="rgba(255,255,255,0.4)"
					placeholder-color="#333333"
					search-icon-color="#333333"
					:input-style="{
						backgroundColor: 'rgba(255,255,255,0)'
					}"
					></u-search>
			</view>
		</view>
		<view slot="right">
			<view class="right-icon" @tap="clickRight">
				<u-icon name="chat" size="44"></u-icon>
			</view>
		</view>
	</sdc-navbar>
</template>

<script>
	export default {
		data() {
			return {
				keyword: ''
			};
		},
		methods:{
			clickLeft(){
				this.$emit('clickLeft')
			},
			clickSearch(){
				this.$emit('clickSearch')
			},
			clickRight(){
				this.$emit('clickRight')
			}
		}
	}
</script>

<style lang="scss">
	.search{
		width: 590rpx;
	}
	.right-icon{
		padding: 0 20rpx;
	}
</style>
